<!doctype html>


<html>
<head>
  <link rel="shortcut icon" href="static/images/favicon.ico" type="image/x-icon">
  <title>hovercard.js (Closure Library API Documentation - JavaScript)</title>
  <link rel="stylesheet" href="static/css/base.css">
  <link rel="stylesheet" href="static/css/doc.css">
  <link rel="stylesheet" href="static/css/sidetree.css">
  <link rel="stylesheet" href="static/css/prettify.css">

  <script>
     var _staticFilePath = "static/";
  </script>

  <script src="static/js/doc.js">
  </script>

  <meta charset="utf8">
</head>

<body onload="prettyPrint()">

<div id="header">
  <div class="g-section g-tpl-50-50 g-split">
    <div class="g-unit g-first">
      <a id="logo" href="index.html">Closure Library API Documentation</a>
    </div>

    <div class="g-unit">
      <div class="g-c">
        <strong>Go to class or file:</strong>
        <input type="text" id="ac">
      </div>
    </div>
  </div>
</div>





<div class="colmask rightmenu">
<div class="colleft">
    <div class="col1">
      <!-- Column 1 start -->

<div id="title">
       <span class="fn">hovercard.js</span>
</div>

<div class="g-section g-tpl-75-25">
  <div class="g-unit g-first" id="description">
    Show hovercards with a delay after the mouse moves over an
 element of a specified type and with a specific attribute.
  </div>
  

        <div class="g-unit" id="useful-links">
          <div class="title">Useful links</div>
          <ol>
            <li><a href="../demos/hovercard.html">Demo</a></li>
            <li><a href="closure_goog_ui_hovercard.js.source.html"><span class='source-code-link'>Source Code</span></a></li>
          </ol>
        </div>
</div>

<h2 class="g-first">File Location</h2>
  <div class="g-section g-tpl-20-80">
    <div class="g-unit g-first">
      <div class="g-c-cell code-label">ui/hovercard.js</div>
    </div>
  </div>
<hr/>


  <h2>Classes</h2>
 <div class="fn-constructor">
        <a href="class_goog_ui_HoverCard.html">
          goog.ui.HoverCard</a><br/>
        <div class="class-details">Create a hover card object.  Hover cards extend tooltips in that they don&#39;t
have to be manually attached to each element that can cause them to display.
Instead, you can create a function that gets called when the mouse goes over
any element on your page, and returns whether or not the hovercard should be
shown for that element.

Alternatively, you can define a map of tag names to the attribute name each
tag should have for that tag to trigger the hover card.  See example below.

Hovercards can also be triggered manually by calling
{@code triggerForElement}, shown without a delay by calling
{@code showForElement}, or triggered over other elements by calling
{@code attach}.  For the latter two cases, the application is responsible
for calling {@code detach} when finished.

HoverCard objects fire a TRIGGER event when the mouse moves over an element
that can trigger a hovercard, and BEFORE_SHOW when the hovercard is
about to be shown.  Clients can respond to these events and can prevent the
hovercard from being triggered or shown.</div>
 </div>
 <div class="fn-constructor">
        <a href="class_goog_ui_HoverCard_TriggerEvent.html">
          goog.ui.HoverCard.TriggerEvent</a><br/>
        <div class="class-details">Create a trigger event for specified anchor and optional data.</div>
 </div>
      








      <!-- Column 1 end -->
    </div>

        <div class="col2">
          <!-- Column 2 start -->
          <div class="col2-c">
            <h2 id="ref-head">Directory ui</h2>
            <div id="localView"></div>
          </div>

          <div class="col2-c">
            <h2 id="ref-head">File Reference</h2>
            <div id="sideFileIndex" rootPath="closure/goog" current="ui/hovercard.js"></div>
          </div>
          <!-- Column 2 end -->
        </div>
</div>
</div>

</body>
</html>
